.root {
    background: white;
    box-shadow: 0px 2px 10px hsla(216, 10%, 28%, 0.05);
    min-height: 400px;
    transition: box-shadow $transition-duration-slow;
}

.root:hover {
    box-shadow: 0px 2px 15px rgba(64, 69, 78, 0.15);
}

.head {
    position: relative;
    padding: 20px;
    padding-top: 15px;
    padding-bottom: 0;
}

.title {
    margin: 0;
    font-size: 18px;
    font-weight: bold;
}

.extra {
    position: absolute;
    right: 20px;
    top: 15px;
}

.body {
    clear: both;
    padding: 20px;
}

.root[border] {
    box-shadow: none;
    border: 1px solid $border-color-base;
}

.root[border]:hover {
    box-shadow: 0 0 7px 0 rgba(0,0,0,.06);
}
